
<template>
<div>
  
  <comp-header :user="user"></comp-header>
  
  <div class="jumbotron">
    <div class="container">
      <h1 class="display-3">{{user.showName}}</h1>
      <p>This is my home page.</p>
      <p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more &raquo;</a></p>
    </div>
  </div>

  <div class="container">
    <!-- Example row of columns -->
    <div class="row">
      <div class="col-md-4" v-for="(b,i) in blogList">
        <h2>{{b.title}}</h2>
        <p class="h6">作者：{{b.userName}}</p>
        <p>{{b.content}} </p>
        <p><a class="btn btn-primary" @click="jump('comp-blog-detail',{id:b.id})" role="button">View details &raquo;</a></p>
      </div>
    </div>
    <hr>

    <footer>
      <p>&copy; Company 2017</p>
    </footer>
  </div>


</div>
</template>

<script>
import CompHeader from './header.vue'
import Swal from 'sweetalert'
import {get} from '../utils/utils.js'
export default {
  data:function () {
    return {
      msg: 'Hello world!',
      blogList:[],
      user:{}
    }
  },
  components:{
    CompHeader
  },
  methods:{
    getBlogList:async function (){
      const user = await get('/users/info')
      if(!user.id){
        this.jump('comp-login')
        return
      }
      this.user = user
      const res = await get('/publish/list', {id:user.id})
      if(res.err==1){
        Swal('', res.msg, 'error')
        return 
      }
      this.blogList = res.blogList
    },
    jump: function (compName, data){
      this.$root.chgComp(compName, data)
    }
  },
  mounted:async function (){
    await this.getBlogList()
  }

}
</script>
